<template>
  <div class="">
    <el-upload
      ref="upload"
      class="upload-demo inline-block"
      accept="image/*"
      :action="uploadUrl"
      :multiple="false"
      :show-file-list="false"
      :on-remove="handleRemove"
      :on-success="handleSuccess"
      name="file"
      :file-list="fileList"
    >
      <el-button size="small" type="primary">点击上传</el-button>
      <div slot="tip" class="el-upload__tip">只能上传图片文件</div>
    </el-upload>
  </div>
</template>
<script>
export default {
  props: {},
  components: {},
  data() {
    return {
      // 图片上传相关
      fileList: [],
      uploadUrl: process.env.VUE_APP_BASE_API + "/api/v1/file/uploadfile",
      previewUrl: process.env.VUE_APP_BASE_API + "/api/v1/file/download",
      uploadHeader: {
        "Content-Type": "multipart/form-data;"
      }
    };
  },
  mounted() {},
  methods: {
    handleRemove() {},
    handleSuccess(response, file, fileList) {
      if (response.code === 0) {
        this.$message.success("上传成功");
        this.$emit("success", this.previewUrl + response.data);
      } else {
        this.$message.danger("上传失败");
      }
    }
  }
};
</script>
<style scoped lang="less"></style>
